SignIn User

Methods for user sign in using magic or wallet address.

signIn method

• The signIn method takes cryptoChainId, the chain ID for the current chain, and magicPublicKey which is the magic public key.

• ​It returns web3, which is the provider returned after the user logs in, accountAddress is the address of the user's crypto wallet, accountBalance is the balance of the user's crypto wallet, magicDisabled is the flag indicating whether the magic button is currently disabled or not, i.e. it is in process or processed.

• user is the user detail of the logged in user, magicError returns the error message if the user logged in with magic and an error occurred during the operation, handleMagicLogin is the method to log in with magic and it takes the email address as parameter, handleMagicLogout is the method to logout the user if he using magic.

• connectCryptoWallet is the method to connect the user's crypto wallet. It takes the email address as a parameter, disableCryptoButton indicates that the crypto button is disabled, handleCryptoLogout handles the crypto logout, i.e. if the user is logged in with the crypto wallet and not magic, use this method.

• cryptoError returns the error message in case of crypto login, checkAccountTypeByEmail this method confirms the user's account type by taking the email address as a parameter, emailError returns the error message regarding the email address used, walletType returns the wallet type the user is using, it can be one of the types magic or crypto.

SignIn method

import React from "react";
import { MetastaqInstance } from "./MetastaqInstance";

export const ShowSignInMethods = () => {
  const { signIn } = MetastaqInstance;

  const {
    web3,
    accountAddress,
    accountBalance,
    magicDisabled,
    user,
    magicError,
    handleMagicLogin,
    handleMagicLogout,
    connectCryptoWallet,
    disableCryptoButton,
    handleCryptoLogout,
    cryptoError,
    checkAccountTypeByEmail,
    emailError,
    walletType,
  } = signIn(cryptoChainId, magicPublicKey);

  return (
    <div>
      <button
        onClick={() => {
          checkAccountTypeByEmail(email);
        }}
      >
        Check by email
      </button>
      <button onClick={() => connectCryptoWallet(email)}>
        Connect an existing wallet{" "}
      </button>
      <button
        onClick={() => {
          handleMagicLogin(email);
        }}
      >
        Magic Login
      </button>
      <button
        onClick={() => {
          handleMagicLogout();
        }}
      >
        Magic Logout
      </button>
      <button onClick={() => handleCryptoLogout()}>Crypto Logout</button>
    </div>
  );
};